<!doctype html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<link rel="shortcut icon" href="./src/assets/favicon.ico" type="image/x-icon">
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<!-- <meta http-equiv="Content-Security-Policy" content="script-src 'self'"> -->
		<meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-eval'">

		<title>躺平生活管理平台</title>
		<style>
			.loading {
				display: inline-block;
				font-size: 28px;
				font-family: Arial, Helvetica, sans-serif;
				font-weight: bold;
				color: #fff;
				text-shadow: 0 0 2px #ff3d00, 0 0 1px #ff3d00, 0 0 1px #ff3d00;
				letter-spacing: 2px;
				position: relative;
			}

			.loading::after {
				content: "Loading";
				position: absolute;
				left: 0;
				top: 0;
				color: #ff3d00;
				width: 0%;
				height: 100%;
				overflow: hidden;
				animation: loading-animation 6s linear infinite;
			}

			@keyframes loading-animation {
				0% {
					width: 0%;
				}

				100% {
					width: 100%;
				}
			}

		</style>
	</head>
	<body>
		<div id="app">
			<div class="loading">Loading</div>
		</div>
		<script type="module" src="/src/main.ts"></script>
	</body>
</html>


<!-- <!DOCTYPE html>
<html lang="en">

	<head>
		<meta charset="UTF-8" />
		<link rel="shortcut icon" href="./src/assets/favicon.ico" type="image/x-icon">
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<meta http-equiv="Content-Security-Policy" content="script-src 'self'">
		<title>躺平生活管理平台</title>
		<style>
			.loading {
				display: inline-block;
				font-size: 28px;
				font-family: Arial, Helvetica, sans-serif;
				font-weight: bold;
				color: #fff;
				text-shadow: 0 0 2px #ff3d00, 0 0 1px #ff3d00, 0 0 1px #ff3d00;
				letter-spacing: 2px;
				position: relative;
			}

			.loading::after {
				content: "Loading";
				position: absolute;
				left: 0;
				top: 0;
				color: #ff3d00;
				width: 0%;
				height: 100%;
				overflow: hidden;
				animation: loading-animation 6s linear infinite;
			}

			@keyframes loading-animation {
				0% {
					width: 0%;
				}

				100% {
					width: 100%;
				}
			}

		</style>
	</head>

	<body>

		<div id="app">
			<div class="loading">Loading</div>
		</div>
		<script type="module" src="/src/main.ts"></script>
	</body>
</html> -->
